<template>
	<view class="m-position">
		<view class="item" v-for="(item, index) in list" :key="index" @click="onClick(item)">
			<view class="logo">
				<image :src="item.companyLogo"></image>
			</view>
			<view class="job">
				<view class="title space-between">
					<view class="left">
						<text class="title-parttime" v-if="item.ifParttime==1">兼职</text>
						<text class="title-parttime2" v-if="item.ifParttime==2">实习</text>
						<text class="title-parttime3" v-if="item.ifParttime==3">临工</text>
						<text class="title-name">{{ item.postName }}</text>
						<text class="title-share" v-if="item.ifReference">内推</text>
					</view>
					<text class="right">{{ formatCreateTime(item.createTime) }}</text>
				</view>
				<view class="company">
					{{ item.companyName }}
					<view class="height-line"></view>
					{{ item.staffSize }}
					<view class="height-line"></view>
					{{ item.companyNature }}
				</view>
				<view class="desc">
					<text>{{item.salary}}<text v-if="item.unit != '元/月'">{{ item.unit}}</text></text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import mEmptyData from '@/components/m-empty-data/m-empty-data.vue';
	import {
		formatDate,
		calCurrentYear
	} from '@/common/date';
	export default {
		name: 'm-position',
		props: {
			list: Array,
		},
		components: {
			mEmptyData
		},
		data() {
			return {
				no_order_1: this.$mAssetsPath.no_order_1
			};
		},

		methods: {
			onClick(item) {
				this.$emit('click', item);
			},
			deleteItem(item) {
				this.$emit('onDelete', item);
			},

			ensure(item) {
				this.$emit('ensure', item);
			},

			formatAge(birthday) {
				return calCurrentYear(birthday);
			},
			formatString(val) {
				return val.split(",");
			},
			formatCreateTime(time) {
				if (time == null || time === '') {
					return null;
				}
				let str = time.replace(/-/g, '/');
				let date = new Date(str);
				return formatDate(date, 'MM-dd hh:mm');
			},
		}
	};
</script>

<style lang="scss">
	.m-position {
		.item {
			background-color: $bgcolor_white;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: flex-start;
			margin-bottom: 20upx;
			border-radius: 10upx;
			padding: 15upx;
		}
		
		.logo{
			margin-right: 20upx;
			border:#eee solid 2upx;
			border-radius: 10upx;
			image{
				width: 120upx;
				height: 120upx;
				border-radius: 10upx;
			}
		}

		.job {
			flex: 1;
			.title {
				.left {
					font-weight: bold;
					font-size: $uni-font-size-lg;
				}

				.title-name {
					font-weight: bold;
					font-size: $uni-font-size-lg;
				}
				
				.title-parttime{
					color: $main-color;
					border: 1upx solid $main-color;
					font-size: $uni-font-size-sm;
					margin-right: 15upx;
					padding: 5upx 10upx;
					border-radius: 6upx;
				}
				.title-parttime2{
					color: green;
					border: 1upx solid green;
					font-size: $uni-font-size-sm;
					margin-right: 15upx;
					padding: 5upx 10upx;
					border-radius: 6upx;
				}
				.title-parttime3{
					color: $uni-color-primary;
					border: 1upx solid $uni-color-primary;
					font-size: $uni-font-size-sm;
					margin-right: 15upx;
					padding: 5upx 10upx;
					border-radius: 6upx;
				}

				.title-share {
					color: $main-color;
					border: 1upx solid $main-color;
					border-radius: 20upx 0upx;
					font-size: $uni-font-size-sm;
					margin-left: 20upx;
					padding: 3upx 10upx;
				}

				.right {
					color: #666;
				}
			}

			.company {
				color: $font-color-666;
				margin-top: 5upx;
				font-size: $uni-font-size-base;
				display: flex;
				flex-direction: row;
				align-items: center;
				flex-wrap: wrap;

				.height-line {
					height: 20upx;
					width: 4upx;
					background-color: $font-color-ccc;
					margin: 0 15upx;
				}
			}

			.desc {
				text {
					color: #666;
				}
			}
		}

	}
	.space-between {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
	}
</style>